<!-- 合同记录 -->
<template>
  <div class="base-info">
    <tableTurn :tableData="getData" :args="args" ref="tableTurnRef">
      <a-table-column :width="80" align="center">
        <template #title> 序号 </template>
        <template #cell="{ rowIndex }">
          {{ rowIndex + 1 }}
        </template>
      </a-table-column>
      <a-table-column
        :title="item.name"
        v-for="(item, index) in selectedHeader"
        :key="index"
        :data-index="item.code"
        align="center"
        :width="200"
      >
        <template v-if="item.code === 'created_at'" #cell="{ record }">
          {{ dayjs(record.created_at).format('YYYY-MM-DD') }}
        </template>
      </a-table-column>
    </tableTurn>
  </div>
</template>

<script lang="ts" setup>
  import { reactive, computed } from 'vue';
  import dayjs from 'dayjs';
  import { useRoute } from 'vue-router';
  import { GetArchivesDetaliType } from '@/api/buy-management/archives-details/index';
  import { GetContractDetail } from '@/api/contract-management/contract-list/index';
  import router from '@/router';

  const props = withDefaults(
    defineProps<{
      contractId: any;
    }>(),
    {}
  );

  // eslint-disable-next-line no-undef
  const route = useRoute();
  const id = Number(props.contractId);
  const getData = async () => {
    const res = await GetContractDetail({ id });
    const NewArr = [{ ...res }];
    return Promise.resolve(NewArr);
  };
  getData();

  const columns = [
    {
      code: 'name',
      isDefault: 1,
      name: '合同名称',
    },
    {
      code: 'number',
      isDefault: 1,
      name: '合同编号',
    },
    {
      code: 'ourSignUserName',
      isDefault: 1,
      name: '我方签约人',
    },
    {
      code: 'created_at',
      isDefault: 1,
      name: '创建时间',
    },
    {
      code: 'createByName',
      isDefault: 1,
      name: '创建人',
    },
  ];

  // 在表格上显示的表头
  const selectedHeader = computed(() => {
    const arr: any = [];
    columns.forEach((item) => {
      if (item.isDefault === 1) {
        arr.push(item);
      }
    });
    return arr;
  });
</script>

<style scoped lang="less">
  .base-info {
    padding: 0 40px;
  }
</style>
